<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="Author" content=" ">
    <title>Document</title>
    <style type="text/css">
        *{margin: 0;padding: 0;}
        .clearfix:after{content:'';display:block;clear:both;}
        .fl{float:left;}
        .fr{float:right;}
        a{text-decoration: none;}
        ul,li{list-style: none;}
        body{font-size: 14px;font-family: "微软雅黑";}
        ul{
            width:1400px;
            border:1px solid #ccc;
            margin:50px auto;

        }
        ul li{text-align: center;padding:10px;}

    </style>
</head>
<body>
    <ul id="randomColor" class='clearfix'>
    </ul>
</body>
<script>
    var oUl = document.getElementById('randomColor');
    var timer,num=0;

           //alert(  ran_16());
           timer = setInterval(function(){
                num++;
                oUl.innerHTML += '<li class="fl" style="background:'+rgba()+'">'+rgba()+'</li>';
                if(num>500){
                    clearInterval( timer );
                }
           },500);



        //随机十六进制法一
        function ran_16(){
            var arr = [0,1,2,3,4,5,6,7,8,9,'A','B','C','D','E','F'];
            var result='';
            for(var i=0;i<6;i++){
                result += arr[ Math.floor(Math.random()*16) ];
            }
            return '#'+result;
        }

        //随机十六进制法二
        function rgb_toString(){
           var arr = '#';
            for(var i=0;i<3;i++ ){
                var color = Math.floor( Math.random()*256 ).toString(16);
                console.log(color);
               arr +=  color.length>1 ? color: '0'+color;
            }
            return arr;
            
        }


        //随机rgb
        //alert( rgb() );
        function rgb(){
           var arr = [[],[],[]];
            for(var i=0;i<100;i++ ){
                arr[i] = Math.floor( Math.random()*256 );
                //console.log( arr[i] );
            }
            return 'rgb('+arr[0]+','+arr[1]+','+arr[2]+')';
        }

		
		function color_RGb(){
			var r =Math.floor(Math.random()*256);
			var g = Math.floor(Math.random()*256);
			var b = Math.floor(Math.random()*256);
			return "("+ r +","+g+","+b+")"
		}
		
		console.log(color_RGb())
		
		function color_RGBA(){
			var r = Math.floor(Math.random()*256);
			var g = Math.floor(Math.random()*256);
			var b = Math.floor(Math.random()*256);
			var a = Math.floor(Math.random());
			return "("+r+","+g+","+b+","+a+")";
		}
		
		
		function color_16(){
			var r = Math.floor(Math.random()*256).toString(16);
			var g = Math.floor(Math.random()*256).toString(16);
			var b = Math.floor(Math.random()*256).toString(16);
			console.log(r)
			return "("+r+","+g+","+b+")";
		}
		 color_16();

        //随机rgba
        //alert(rgba());
        function rgba(){
           var arr = [];
            for(var i=0;i<100;i++ ){
                arr[i] = Math.floor( Math.random()*256 );
                //console.log( arr[i] );
            }
            arr[3] = (Math.random()*1).toFixed(1);
            return 'rgba('+arr[0]+','+arr[1]+','+arr[2]+','+arr[3]+')';
        }


</script>
</html>
